/****************************************/
/* General :: Styles                    */
/****************************************/
*{margin:0;padding:0}
:focus{outline:none}

html{height:100%}
body{height:100%;background:#151514;color:#ccc}
body,input,select,textarea{font:13px Georgia, "Times New Roman", Times, Arial, Verdana, Helvetica}
#global{height:100%}
.w{width:981px;height:100%;margin:auto;position:relative}

h1{font-size:1.5em}

/****************************************/
/* Header :: Menu                       */
/****************************************/
#header{position:fixed;bottom:0;left:0;width:100%;height:100px;z-index:100}
#menu{height:100%;width:100%;position:absolute;bottom:0;border-top:1px solid #222;box-shadow:0 -2px 3px #111;background:#151515;-o-background-size: 100% 100%;-moz-background-size: 100% 100%;-webkit-background-size: 100% 100%;background-size: 100% 100%;background:-webkit-gradient(linear,left top,left bottom,from(#1c1c1c),to(#151515));background: -webkit-linear-gradient(top,#1c1c1c,#151515);background: -moz-linear-gradient(top,#1c1c1c,#151515);background: -o-linear-gradient(top,#1c1c1c,#151515);background: linear-gradient(top,#1c1c1c,#151515)}
body.home #menu{display:none}
#menu.big{height:320px}
#menu ul{list-style:none;margin-top:34px}
#menu li{display:inline-block}
#menu a{position:relative;display:inline-block;margin-right:12px;font-size:1.3em;color:#fff;text-decoration:none;height:20px;line-height:27px}
#menu a.evenementiel,#menu a.travaux,#menu a.ceremonies,#menu a.portraits{background-repeat:no-repeat;text-indent:-9999px}
#menu a.evenementiel{background:url(../images/pict_evenementiel.png) -47px 0;width:115px}
#menu a.travaux{background:url(../images/pict_travaux.png) -88px 0;width:70px}
#menu a.ceremonies{background:url(../images/pict_ceremonies.png) -63px 0;width:98px}
#menu a.portraits{background:url(../images/pict_portraits.png) -84px 0;width:77px}
#menu a.red{color:#b30e19}
#menu a.selected span{display:inline-block;position:absolute;top:24px;left:50%;margin-left:-10px;width:20px;border-bottom:2px solid #b30e19}
#menu a.red.selected span{border-color:#ccc}
/* Menu fade */
#menu a,.js #menu a:hover{opacity:.7}
#menu a:hover{opacity:1}
#menu a.nothover{opacity:.15}

/****************************************/
/* Header :: Logo                       */
/****************************************/
#logo{display:block;width:180px;height:95px;background:url(../images/logo.png);position:absolute;bottom:5px;left:50%;margin-left:310px;z-index:100}



/****************************************/
/* Page :: General                      */
/****************************************/
#container{height:100%;position:relative}
.page{position:relative;top:0;left:0;height:100%;width:100%}
.page ul{list-style:none}


/****************************************/
/* Page :: Home                         */
/****************************************/
#home ul{position:absolute;top:50%;margin-top:-350px;left:50%;margin-left:-345px}
#home ul li{display:inline-block;margin:0 5px}
#home a img{width:160px;height:626px}
/* Image fade */
#home a,.js #home a:hover{opacity:.85}
#home a:hover{opacity:1}
#home a.nothover{opacity:.2}


/****************************************/
/* Page :: Événementiel                 */
/****************************************/
#evenementiel{height:672px;padding-top:3%;padding-bottom:120px;}
#evenementiel ul{position:absolute;height:100%}
#evenementiel ul li{position:absolute}
#evenementiel ul li a{display:inline-block}
#evenementiel ul li h1{color:#eee;position:absolute}
#evenementiel .danse{padding-top:25px;top:0;left:225px}
#evenementiel .danse img{height:280px}
#evenementiel .danse h1{top:0;left:0}
#evenementiel .soirees{padding-top:25px;top:80px;left:510px}
#evenementiel .soirees img{height:200px}
#evenementiel .soirees h1{top:0;right:0}
#evenementiel .concerts{padding-bottom:25px;top:325px;left:160px}
#evenementiel .concerts img{height:220px}
#evenementiel .concerts h1{bottom:0;left:0}
#evenementiel .spectacles{padding-bottom:25px;top:325px;left:510px}
#evenementiel .spectacles img{height:320px}
#evenementiel .spectacles h1{bottom:0;right:0}

/* Menu fade */
#evenementiel a,.js #evenementiel a:hover{opacity:.7}
#evenementiel a:hover{opacity:1}
#evenementiel a.nothover{opacity:.15}